<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" th:href="@{/static/css/minireset.css}" />
    <link rel="stylesheet" th:href="@{/static/css/common.css}" />
    <link rel="stylesheet" th:href="@{/static/css/cart.css}" />
    <script language="JavaScript" th:src="@{static/script/vue.js}"></script>
    <script language="JavaScript" th:src="@{static/script/axios.min.js}"></script>
    <script language="JavaScript" th:src="@{/static/script/cart.js}"></script>
  </head>
  <body>
    <div class="header">
      <div class="w">
        <div class="header-left">
<!--          有问题-->
          <a th:href="@{/index}"><img th:src="@{/static/img/logo.gif}" alt=""/></a>
          <h1>我的购物车</h1>
        </div>
        <div class="header-right">
          <h3>欢迎<span th:text="${session.user.uname}">张总</span>光临尚硅谷书城</h3>
          <div class="order"><a th:href="@{/order}">我的订单</a></div>
          <div class="destory"><a th:href="@{/login}">注销</a></div>
          <div class="gohome">
            <a th:href="@{/index}">返回</a>
          </div>
        </div>
      </div>
    </div>
    <div class="list" id="cart_div">
      <div class="w">
        <table>
          <thead>
            <tr>
              <th>图片</th>
              <th>商品名称</th>

              <th>数量</th>
              <th>单价</th>
              <th>金额</th>
              <th>操作</th>
            </tr>
          </thead>
          <tbody>
            <tr v-for="cartItem in cart.cartItemMap">
              <td>
                <img :src="'/pro05_book_ssm_war_exploded/static/uploads/'+cartItem.book.bookImg" alt="" />
              </td>
              <td>{{cartItem.book.bookName}}</td>
              <td>
                <span class="count" @click="updateCartMove(cartItem.book.bid)">-</span>
                <input class="count-num" type="text" :value="cartItem.buyCount" />
                <span class="count"  @click="updateCartAdd(cartItem.book.bid)">+</span>
              </td>
              <td >{{cartItem.book.price}}</td>
              <td >{{cartItem.xj}}</td>
              <td><a href="">删除</a></td>
            </tr>
          </tbody>
        </table>
        <div class="footer">
          <div class="footer-left">
            <a href="#" class="clear-cart">清空购物车</a>
            <a th:href="@{/index}">继续购物</a>
          </div>
          <div class="footer-right">
            <div>共<span>{{cart.totalBookCount}}</span>件商品</div>
            <div class="total-price">总金额<span>{{cart.totalMoney}}</span>元</div>
            <a class="pay" th:href="@{/checkout}">去结账</a>
          </div>
        </div>
      </div>
    </div>
    <div class="bottom">
      <div class="w">
        <div class="top">
          <ul>
            <li>
              <a href="">
                <img th:src="@{/static/img/bottom1.png}" alt="" />
                <span>大咖级讲师亲自授课</span>
              </a>
            </li>
            <li>
              <a href="">
                <img th:src="@{/static/img/bottom.png}" alt="" />
                <span>课程为学员成长持续赋能</span>
              </a>
            </li>
            <li>
              <a href="">
                <img th:src="@{/static/img/bottom2.png}" alt="" />
                <span>学员真是情况大公开</span>
              </a>
            </li>
          </ul>
        </div>
        <div class="content">
          <dl>
            <dt>关于尚硅谷</dt>
            <dd>教育理念</dd>
            <!-- <dd>名师团队</dd>
            <dd>学员心声</dd> -->
          </dl>
          <dl>
            <dt>资源下载</dt>
            <dd>视频下载</dd>
            <!-- <dd>资料下载</dd>
            <dd>工具下载</dd> -->
          </dl>
          <dl>
            <dt>加入我们</dt>
            <dd>招聘岗位</dd>
            <!-- <dd>岗位介绍</dd>
            <dd>招贤纳师</dd> -->
          </dl>
          <dl>
            <dt>联系我们</dt>
            <dd>http://www.atguigu.com</dd>
            <dd></dd>
          </dl>
        </div>
      </div>
      <div class="down">
        尚硅谷书城.Copyright ©2015
      </div>
    </div>

  </body>
</html>
